<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@page isELIgnored="true" %>
<html>
<head>
    <title>库存预警</title>
    <%@include file="/comm/head.jsp"%>
</head>
<body>
<div  id="root">
<i-table  :columns="Columns1" :data="mydata" :height="400" border stripe  >
</i-table>
    <br>
<shiro:hasPermission name="dsjbyj:add">
    <i-button type="warning" icon="ios-chatbubbles" @click="toSendEmail">发送警报邮件</i-button>
</shiro:hasPermission>
    <modal  v-model="emailFlag" title="发送库存预警邮件" width="400">
        <i-form :label-width="80" >
            <form-item label="收件人:">
                <i-select v-model="user.id" style="width: 150px;"  @on-change="sjrchange" >
                    <i-Option v-for="item1 in userList" :value="item1.id" :key="item1.id">{{item1.username}}</i-Option>
                </i-select>
            </form-item>
            <form-item label="角色:">
                <i-select v-model="user.userRole" style="width: 150px;" disabled="disabled">
                    <i-Option v-for="item1 in roleList" :value="item1.id" :key="item1.id">{{item1.roleName}}</i-Option>
                </i-select>
            </form-item>
            <form-item label="邮箱:">
                <i-input v-model="user.email"style="width: 150px;" size="large" readonly />
            </form-item>
        </i-form>
        <div slot="footer">
            <i-button type="success" @click="send" style="margin-left: 30px">发送邮件</i-button>
            <i-button  type="primary"  @click="toQuxiao" >取消发送</i-button>
        </div>
    </modal>
</div>
<script>
    new Vue({
        el:"#root",
        data:{
            Columns1:[
                {key:"id",title:"商品编号",align:"center"},
                {key:"name",title:"商品名称",align:"center"},
                {key:"shuliang",title:"库存数量",align:"center"},
                {key:"num",title:"代发货数量",align:"center"},
            ],
            mydata:[],
            emailFlag:false,
            user:{},
            userList:[],
            userList1:[],
            roleList:[],
        },
        methods:{
            searchGoodsList(){
                axios.get(`${ctx}/kucun/kcyj/list`)
                    .then(({data})=>{
                        this.mydata=data.result;
                    });
            },
            searchUserList(){
                axios.get(`${ctx}/renshi/user/Sjlist`)
                    .then(({data})=>{
                        this.userList=data.result;
                    });
            },
            searchRoleList(){
                axios.get(`${ctx}/sys/role/list1?id=${this.userList1[0].userRole}`)
                    .then(({data})=>{
                        this.roleList=data.result;
                        this.user.userRole=this.roleList[0].id
                    });
            },
            toSendEmail(){
               this.emailFlag=true
            },
            send(){
                axios.get(`${ctx}/kucun/kcyj/send?email=${this.user.email}`)
                    .then(({data})=>{
                        iview.Message.success({content:data.msg});
                        this.user={};
                        this.emailFlag=false
                    });
            },
            sjrchange(event){
                axios.get(`${ctx}/renshi/user/list1?id=${event}`)
                    .then(({data})=>{
                        this.userList1=data.result;
                        this.searchRoleList();
                        this.user.email=this.userList1[0].email;
                    });
            },
            toQuxiao(){
                this.user={}
                this.emailFlag=false
                this.$Message.success("您已取消发送")
            }
        },
        mounted(){
            this.searchGoodsList();
            this.searchUserList();
        }
    });
</script>
</body>
</html>
